@include b(drawer) {
  @include e(overlay) {
    position: absolute;
    inset: 0;
    background-color: getCssVar(color, bg, overlay);
  }
  @include e(body) {
    position: absolute;
    bottom: 0;
    background-color: getCssVar(color, bg, 0);
    box-shadow:
      0px 16px 48px 16px rgba(0, 0, 0, 0.08),
      0px 12px 32px rgba(0, 0, 0, 0.12),
      0px 8px 16px -8px rgba(0, 0, 0, 0.16);
    @include m(right) {
      right: 0;
    }
    @include m(top) {
      top: 0;
      bottom: auto;
    }
    @include when(show-close) {
      > .#{bem(view)} {
        > .#{bem(control-viewlayoutpanel)} {
          > .#{bem(control-viewlayoutpanel-content)} {
            > .#{bem(col)} {
              > .#{bem(panel-view-header)} {
                padding-right: getCssVar(spacing, super-loose);
              }
            }
          }
        }
      }
    }
  }
  @include e(icon) {
    @include m(close) {
      position: absolute;
      top: getCssVar(spacing, base-loose);
      right: getCssVar(spacing, base);
      width: getCssVar(width, icon, large);
      height: getCssVar(width, icon, large);
      line-height: getCssVar(width, icon, large);
      cursor: pointer;

      &:hover {
        color: getCssVar(color, primary, hover);
      }
    }
  }
}
